<div class="row">
	<div class="col-xs-12">
		<div class="box">
			<div class="box-header">
				<h3 class="box-title">角色管理</h3>
				<div class="box-tools pull-right">
						<@shiro.hasPermission name="role:add">
						<a  class="btn btn-sm btn-primary" id="roleAddUrl" target="modal" modal="lg" href="javascript:;">添加</a>
						</@shiro.hasPermission>
				</div>
			</div>
			<div class="box-body">
                <div class="col-md-3">
                    <div class="form-group">
                        <ul id="roleztree" class="ztree"></ul>
                    </div>
                </div>
                <div class="col-md-9">
				<table id="role_tab" class="table table-bordered table-striped">
					<thead>
						<tr>
							<tr>
								<th>名称</th>
                            	<th>描述</th>
								<th>状态</th>
								<th>部门</th>
								<th>操作</th>
							</tr>
						</tr>
					</thead>
				</table>
				</div>
			</div>
		</div>
	</div>
</div>

<link rel="stylesheet" href="plugins/ztree/metroStyle/metroStyle.css">
<script src="plugins/ztree/jquery.ztree.core.min.js"></script>
<script src="plugins/ztree/jquery.ztree.excheck.min.js"></script>

<script type="text/javascript">
var role_tab;
var nowTreeId ;


$(function() {

    /*****ztree*****/
    var setting = {
        check: {
            enable: false,
        },
        data: {
            simpleData: {
                enable: true
            }
        },
        callback: {
            onClick: onMouseClick
        }
    };

    var zNodes =[
	<#list list as o>
        { "id":${o.id},<#if o.id == orgId>"open":true,</#if> "pId":${o.parentId}, "name":"${o.name}"},
	</#list>
    ];

    function onMouseClick(event, treeId, treeNode) {
        if(treeNode != null){
            nowTreeId = treeNode.id;
            var param = {"orgId" : nowTreeId};
            role_tab.settings()[0].ajax.data = param;
            role_tab.ajax.reload();

            $("#roleAddUrl").attr("href","/admin/role/add?orgId="+nowTreeId);
        }
    }

    $("#roleAddUrl").on('click',function () {
        var href = $("#roleAddUrl").attr("href");
        if (href == 'javascript:;'){
            alertMsg("请选择上级目录","warning");
            return false;
        }
    })


	//初始化树
    $.fn.zTree.init($("#roleztree"), setting, zNodes);

	//初始化表格
	var No=0;
    role_tab = $('#role_tab').DataTable({
		"dom":'itflp',
		"processing":true,
		"searching":false,
		"bInfo":false,
		"bServerSide":false,
        "paging":false,
        "bSort":false,
		"language":{"url":"plugins/datatables/language.json"},
		"ajax":{"url":"/admin/role/list","type":"post"},
		"columns":[ 
			{"data":"role"},
            {"data":"description"},
            {"data":"status"},
			{"data":"orgName"},
			{"data":null} 
			],
		"columnDefs":[
			{
			    targets: 2,
			    data: null,
			    render: function (data) {
			    	if(data == "0"){
			    		return "停用";
			    	}
			    	if(data == "1"){
			    		return "启用";
			    	}
			    	return "未知状态";
			    }
			},
            {
				"targets" : -1,
				"data" : null,
				"render" : function(data) {
					var btn = '<@shiro.hasPermission name="role:read">'
							+'<a class="btn btn-xs btn-primary" target="modal" modal="lg" href="/admin/role/view?id='+ data.id+'">查看</a>&nbsp;'
							+'</@shiro.hasPermission>'
							+'<@shiro.hasPermission name="role:edit">'
							+'<a class="btn btn-xs btn-info"  target="modal"  modal="lg" href="/admin/role/edit?id='+ data.id+'">修改</a>&nbsp;'
							+'</@shiro.hasPermission>'
							+'<@shiro.hasPermission name="role:delete">'
							+'<a class="btn btn-xs btn-default " callback="roleReload();" data-body="确认要删除吗？" target="ajaxTodo" href="/admin/role/delete?id='+ data.id +'">删除</a>';
						    +'</@shiro.hasPermission>'
						return btn;
				}
		} ]
	}).on('xhr.dt', function ( e, settings, data ,xhr) {
        dataTableMsg(data,xhr);
    } );
});

function roleReload(){
    var param = {"orgId" : nowTreeId};
    role_tab.settings()[0].ajax.data = param;
    role_tab.ajax.reload();
}

</script>